<template>
	<view class="content">
		<view class="input-group">
			<!-- <view class="input-row border">
				<text class="title">账号：</text>
				<m-input class="m-input" type="text" clearable focus v-model="tell" placeholder="请输入账号"></m-input>
			</view> -->
			<view class="input-row">
				<text class="title">密码：</text>
				<m-input type="password" displayable v-model="password" placeholder="请输入密码"></m-input>
			</view>
			<view class="input-row">
				<text class="title">重复密码：</text>
				<m-input type="password" displayable v-model="password1" placeholder="请输入密码"></m-input>
			</view>
		</view>
		<!-- <view class="input-group">
			<view class="input-row border">
				<text class="title">验证码：</text>
				<m-input class="m-input" type="text" clearable focus v-model="yanzhengma" placeholder="请输入验证码"></m-input>
				<button type="primary" :disabled="isen" size="mini" @tap="getYanzhengma">{{ tip }}</button>
			</view>
		</view> -->
		<view class="btn-row"><button type="primary" class="primary" @tap="findPassword">提交</button></view>
	</view>
</template>

<script>
import mInput from '../../components/m-input.vue';
import { mapState, mapMutations } from 'vuex';
export default {
	components: {
		mInput
	},
	computed: mapState(['URL', 'TOKEN']),
	data() {
		return {
			// tell: '',
			yanzhengma: '111222',
			tip: '获取验证码',
			isen: false,
			password: '',
			password1: '',
			isPass: false
		};
	},
	methods: {
		...mapMutations(['TO_UPDATE', 'SIGN_OUT']),
		findPassword() {
			this.testing();
			if (this.isPass) {
				uni.getStorage({
					key: 'USER_INFO',
					success: res => {
						this.tijiao(res.data.userId);
					}
				});
			}
		},
		testing() {
			if (this.yanzhengma.length !== 6) {
				uni.showToast({
					icon: 'none',
					title: '验证码错误'
				});
				return;
			}
			if (this.password.length < 5) {
				uni.showToast({
					icon: 'none',
					title: '至少6位'
				});
				return;
			}
			if (this.password !== this.password1) {
				uni.showToast({
					icon: 'none',
					title: '密码不一致'
				});
				return;
			}

			this.isPass = true;
		},
		getYanzhengma() {
			let miao = 60;
			this.isen = true;
			let timer = setInterval(() => {
				this.tip = miao-- + 's后可再次获取';
				if (miao === 0) {
					clearInterval(timer);
					this.tip = '获取验证码';
					this.isen = false;
				}
			}, 1000);
		},
		tijiao(ID) {
			let reqData = {
				password: this.password,
				userId: ID
			};
			uni.request({
				url: this.URL + 'user/editPassword',
				data: reqData,
				header: {
					token: this.TOKEN
				},
				success: res => {
					this.showTip();
					this.goMain();
				}
			});
		},
		showTip() {
			uni.showToast({
				icon: 'none',
				title: '修改成功',
				duration: 2000
			});
		},
		goMain() {
			this.SIGN_OUT();
			setTimeout(function() {
				uni.navigateBack();
			}, 2000);
		}
	}
};
</script>

<style lang="scss">
.input-row {
	input {
		height: 80upx;
		line-height: 80upx;
	}
	uni-input {
		height: 80upx;
		line-height: 80upx;
	}
	button {
		line-height: 80upx;
		min-width: 280upx;
	}
}
</style>
